<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<!--[if lt IE 9 ]> <html lang="en" dir="ltr" class="no-js ie-old"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" dir="ltr" class="no-js ie9"> <![endif]-->
<!--[if IE 10 ]> <html lang="en" dir="ltr" class="no-js ie10"> <![endif]-->
<!--[if (gt IE 10)|!(IE)]><!-->
<html lang="en" dir="ltr" class="no-js">
<!--<![endif]-->

<head>

<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<!-- META TAGS                                 -->
<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<meta charset="utf-8">
<!-- Always force latest IE rendering engine -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Mobile specific meta -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->

<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<!-- PAGE TITLE                                -->
<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<title>FRIDAY | Coupons, Deals, Discounts and Promo codes
	Template</title>

<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<!-- SEO METAS                                 -->
<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<meta name="description"
	content="FRIDAY is a responsive multipurpose-ecommerce site template allows you to store coupons and promo codes from different brands and create store for deals, discounts, It can be used as coupon website such as groupon.com and also as online store">
<meta
	name="	black friday, coupon, coupon codes, coupon theme, coupons, deal news, deals, discounts, ecommerce, friday deals, groupon, promo codes, responsive, shop, store coupons">
<meta name="robots" content="index, follow">
<meta name="author" content="CODASTROID">

<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<!-- PAGE FAVICON                              -->
<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<link rel="apple-touch-icon"
	href="assets/images/favicon/apple-touch-icon.png">
<link rel="icon" href="assets/images/favicon/favicon.ico">

<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<!-- GOOGLE FONTS                              -->
<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<link
	href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600"
	rel="stylesheet">

<!-- ––––––––––––––––––––––––––––––––––––––––– -->
<!-- Include CSS Filess                        -->
<!-- ––––––––––––––––––––––––––––––––––––––––– -->

<!-- Bootstrap -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet">

<!-- Font Awesome -->
<link href="assets/vendors/font-awesome/css/font-awesome.min.css"
	rel="stylesheet">

<!-- Linearicons -->
<link href="assets/vendors/linearicons/css/linearicons.css"
	rel="stylesheet">

<!-- Owl Carousel -->
<link href="assets/vendors/owl-carousel/owl.carousel.min.css"
	rel="stylesheet">
<link href="assets/vendors/owl-carousel/owl.theme.min.css"
	rel="stylesheet">

<!-- Flex Slider -->
<link href="assets/vendors/flexslider/flexslider.css" rel="stylesheet">

<!-- Template Stylesheet -->
<link href="assets/css/base.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">

</head>

<body id="body" class="wide-layout preloader-active">


	<!--[if lt IE 9]>
        <p class="browserupgrade alert-error">
        	You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.
        </p>
    <![endif]-->

	<noscript>
		<div class="noscript alert-error">
			For full functionality of this site it is necessary to enable
			JavaScript. Here are the <a href="http://www.enable-javascript.com/"
				target="_blank"> instructions how to enable JavaScript in your
				web browser</a>.
		</div>
	</noscript>

	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- PRELOADER                                 -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- Preloader -->
	<div id="preloader" class="preloader">
		<div class="loader-cube">
			<div class="loader-cube__item1 loader-cube__item"></div>
			<div class="loader-cube__item2 loader-cube__item"></div>
			<div class="loader-cube__item4 loader-cube__item"></div>
			<div class="loader-cube__item3 loader-cube__item"></div>
		</div>
	</div>
	<!-- End Preloader -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- WRAPPER                                   -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<div id="pageWrapper" class="page-wrapper">
		<jsp:include page="head.jsp"></jsp:include>
		<!-- –––––––––––––––[ PAGE CONTENT ]––––––––––––––– -->
		<main id="mainContent" class="main-content">
			<div class="page-container ptb-10">
				<div class="container">
					<section class="section deals-area ptb-30">

						<!-- Page Control -->
						<header class="page-control panel ptb-15 prl-20 pos-r mb-30">

							<!-- List Control View -->
							<ul class="list-control-view list-inline">
								<li><a href="deals_list.html"><i class="fa fa-bars"></i></a>
								</li>
								<li><a href="deals_grid.html"><i class="fa fa-th"></i></a></li>
							</ul>
							<!-- End List Control View -->

							<div class="right-10 pos-tb-center">
								<select class="form-control input-sm">
									<option>SORT BY</option>
									<option>Newest items</option>
									<option>Best sellers</option>
									<option>Best rated</option>
									<option>Price: low to high</option>
									<option>Price: high to low</option>
								</select>
							</div>
						</header>
						<!-- End Page Control -->
						<div class="row row-masnory row-tb-20">

							<c:forEach items="${goodsList}" var="g">
								<div class="col-sm-6 col-lg-4">
									<div class="deal-single panel">
										.
										<figure
											class="deal-thumbnail embed-responsive embed-responsive-16by9"
											data-bg-img="${g.gimage}">
											<div class="label-discount left-20 top-15">-${(1-g.gdiscount)*100}%</div>
											<ul class="deal-actions top-15 right-20">
												<li class="like-deal"><span> <i
														class="fa fa-heart"></i>
												</span></li>
												<li class="share-btn">
													<div class="share-tooltip fade">
														<a target="_blank" href="#"><i class="fa fa-facebook"></i></a>
														<a target="_blank" href="#"><i class="fa fa-twitter"></i></a>
														<a target="_blank" href="#"><i
															class="fa fa-google-plus"></i></a> <a target="_blank"
															href="#"><i class="fa fa-pinterest"></i></a>
													</div> <span><i class="fa fa-share-alt"></i></span>
												</li>
												<li><span> <i class="fa fa-camera"></i>
												</span></li>
											</ul>
											<div class="time-left bottom-15 right-20 font-md-14">
												<span> <i class="ico fa fa-clock-o mr-10"></i> <span
													class="t-uppercase" data-countdown="${g.gdistime}"></span>
												</span>
											</div>
											<div class="deal-store-logo">
												<img src="${g.gimage}" alt="">
											</div>
										</figure>
										<div class="bg-white pt-20 pl-20 pr-15">
											<div class="pr-md-10">
												<div class="rating mb-10">
													<span class="rating-stars rate-allow" data-rating="5">
														<i class="fa fa-star-o"></i> <i class="fa fa-star-o"></i>
														<i class="fa fa-star-o"></i> <i class="fa fa-star-o"></i>
														<i class="fa fa-star-o"></i>
													</span> <span class="rating-reviews"> ( <span
														class="rating-count">241</span> rates )
													</span>
												</div>
												<h3 class="deal-title mb-10">
													<a href="deal_single.html">${g.glongname}</a>
												</h3>
												<ul class="deal-meta list-inline mb-10 color-mid">
													<li><i class="ico fa fa-map-marker mr-10"></i>${g.gtypename}</li>
													<li><i class="ico fa fa-shopping-basket mr-10"></i>120
														Bought</li>
												</ul>
												<p class="text-muted mb-20">${g.gdesc}</p>
											</div>
											<div class="deal-price pos-r mb-15">
												<h3 class="price ptb-5 text-left">
													<span class="price-sale">￥${g.gprice}</span>
													<fmt:formatNumber value="${g.gprice * g.gdiscount}"
														type="currency" pattern="￥.00" />
												</h3>
												<button
													class="btn btn-o btn-xs pos-a right-10 pos-tb-center"
													name="shopbt" id="cart" gid="${g.gid }">添加到购物车</button>
											</div>
										</div>
									</div>
								</div>

							</c:forEach>
						</div>
				</div>

				<!-- Page Pagination -->
				<div class="page-pagination text-center mt-30 p-10 panel">
					<nav>
						<!-- Page Pagination -->
						<ul class="page-pagination">
							<li><a class="page-numbers previous" href="#">Previous</a></li>
							<li><a href="#" class="page-numbers">1</a></li>
							<li><span class="page-numbers current">2</span></li>
							<li><a href="#" class="page-numbers">3</a></li>
							<li><a href="#" class="page-numbers">4</a></li>
							<li><span class="page-numbers dots">...</span></li>
							<li><a href="#" class="page-numbers">20</a></li>
							<li><a href="#" class="page-numbers next">Next</a></li>
						</ul>
						<!-- End Page Pagination -->
					</nav>
				</div>
				<!-- End Page Pagination -->

				</section>

			</div>
	</div>


	</main>
	<!-- –––––––––––––––[ END PAGE CONTENT ]––––––––––––––– -->
	<section class="footer-top-area pt-70 pb-30 pos-r bg-blue">
		<div class="container">
			<div class="row row-tb-20">
				<div class="col-sm-12 col-md-7">
					<div class="row row-tb-20">
						<div class="footer-col col-sm-6">
							<div class="footer-about">
								<img class="mb-40" src="assets/images/logo_light.png"
									width="250" alt="">
								<p class="color-light">Lorem ipsum dolor sit amet,
									consectetur adipisicing elit. Laboriosam dolores quidem
									mollitia id ipsa nisi necessitatibus iure repudiandae aperiam,
									odit ipsam dolor fugiat corporis nesciunt illo nemo minus.</p>
							</div>
						</div>
						<div class="footer-col col-sm-6">
							<div class="footer-top-twitter">
								<h2 class="color-lighter">Twitter Feed</h2>
								<ul class="twitter-list">
									<li class="single-twitter">
										<p class="color-light">
											<i class="ico fa fa-twitter"></i><a href="#">@masum_rana
												:</a> Duis aute irure dolor in reprehenderit in voluptate velit
											esse cillum dolore in reprehenderit.
										</p>
									</li>
									<li class="single-twitter">
										<p class="color-light">
											<i class="ico fa fa-twitter"></i><a href="#">@masum_rana
												:</a> Lorem ipsum dolor sit amet, consectetur adipisicing elit.
											Ratione id corrupti iusto cupiditate omnis.
										</p>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
				<div class="col-sm-12 col-md-5">
					<div class="row row-tb-20">
						<div class="footer-col col-sm-6">
							<div class="footer-links">
								<h2 class="color-lighter">Quick Links</h2>
								<ul>
									<li><a href="deals_grid.html">Latest Deals</a></li>
									<li><a href="coupons_grid.html">Newest Coupons</a></li>
									<li><a href="contact_us_02.html">Contact Us</a></li>
									<li><a href="404.html">Error 404</a></li>
									<li><a href="terms_conditions.html">Terms of Use</a></li>
									<li><a href="faq.html">FAQs</a></li>
								</ul>
							</div>
						</div>
						<div class="footer-col col-sm-6">
							<div class="footer-top-instagram instagram-widget">
								<h2>Instagram Widget</h2>
								<div class="row row-tb-5 row-rl-5">


									<div class="instagram-widget__item col-xs-4">
										<img src="assets/images/instagram/instagram_01.jpg" alt="">
									</div>


									<div class="instagram-widget__item col-xs-4">
										<img src="assets/images/instagram/instagram_02.jpg" alt="">
									</div>


									<div class="instagram-widget__item col-xs-4">
										<img src="assets/images/instagram/instagram_03.jpg" alt="">
									</div>


									<div class="instagram-widget__item col-xs-4">
										<img src="assets/images/instagram/instagram_04.jpg" alt="">
									</div>


									<div class="instagram-widget__item col-xs-4">
										<img src="assets/images/instagram/instagram_05.jpg" alt="">
									</div>


									<div class="instagram-widget__item col-xs-4">
										<img src="assets/images/instagram/instagram_06.jpg" alt="">
									</div>


								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="col-xs-12">
					<div class="payment-methods t-center">
						<span><img src="assets/images/icons/payment/paypal.jpg"
							alt=""></span> <span><img
							src="assets/images/icons/payment/visa.jpg" alt=""></span> <span><img
							src="assets/images/icons/payment/mastercard.jpg" alt=""></span> <span><img
							src="assets/images/icons/payment/discover.jpg" alt=""></span> <span><img
							src="assets/images/icons/payment/american.jpg" alt=""></span>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- –––––––––––––––[ FOOTER ]––––––––––––––– -->
	<footer id="mainFooter" class="main-footer">
		<div class="container">
			<div class="row">
				<p>Copyright &copy; 2016 . All rights reserved.</p>
			</div>
		</div>
	</footer>
	<!-- –––––––––––––––[ END FOOTER ]––––––––––––––– -->

	</div>
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- END WRAPPER                               -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->


	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- BACK TO TOP                               -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<div id="backTop" class="back-top is-hidden-sm-down">
		<i class="fa fa-angle-up" aria-hidden="true"></i>
	</div>

	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- SCRIPTS                                   -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->

	<!-- (!) Placed at the end of the document so the pages load faster -->

	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- Initialize jQuery library                 -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<script src="assets/js/jquery-1.12.3.min.js"></script>

	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- Latest compiled and minified Bootstrap    -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>

	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- JavaScript Plugins                        -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- (!) Include all compiled plugins (below), or include individual files as needed -->

	<!-- Modernizer JS -->
	<script src="assets/vendors/modernizr/modernizr-2.6.2.min.js"></script>

	<!-- Owl Carousel -->
	<script type="text/javascript"
		src="assets/vendors/owl-carousel/owl.carousel.min.js"></script>

	<!-- FlexSlider -->
	<script type="text/javascript"
		src="assets/vendors/flexslider/jquery.flexslider-min.js"></script>

	<!-- Coutdown -->
	<script type="text/javascript"
		src="assets/vendors/countdown/jquery.countdown.js"></script>

	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<!-- Custom Template JavaScript                   -->
	<!-- ––––––––––––––––––––––––––––––––––––––––– -->
	<script type="text/javascript" src="assets/js/main.js"></script>
</body>

</html>
